<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<input type="file" multiple accept='image/*' id="file1">
<button id="btn">提交</button>

<p id="loading">

</p>

<script>

    let loading = document.getElementById('loading');

    document.querySelector('#btn').onclick = function () {

        loading.innerHTML = '正在上传中...'

        let file1 = document.getElementById('file1');
        let files = file1.files;

        let formData = new FormData();
        [].slice.call(files).forEach((value, index) => {
            console.log(value, index);
            formData.append('img' + index, value, value.name);
        });

        let xhr = new XMLHttpRequest();
        xhr.open('POST', '/upload');
        xhr.onload = function () {
            if (xhr.status >= 200 && xhr.status < 300 || xhr.status == 304) {
                console.log(xhr.responseText);
                // alert(xhr.responseText)
                loading.innerHTML = xhr.responseText;
            }
        }
        xhr.send(formData);
    }
</script>
</body>
</html>